<template>
    <div class="operation">
        <ul>
            <li>
                <span id="date">
                    <i class="fa fa-clock-o"></i>{{data.entdate}}</span>
            </li>
            <li>
                <i class="fa fa-eye"></i> 浏览({{data.view}})</li>
            <li>
                <router-link :to="{path:'/article/' + data.id}">
                    <i class="fa fa-comment-o"></i> 评论({{data.comment_num}})</router-link>
            </li>
            <li>
                <a @click="givePraise">
                    <i class="fa fa-thumbs-o-up"></i> 点赞({{data.praise}})</a>
            </li>
            <!--<li><p v-if="show">+1</p></li>-->
        </ul>
    </div>
</template>
<script>
export default {
    data() {
        return {
            show: false,
            praise: true
        }
    },
    methods: {
        givePraise: function () {
            if (this.praise == true) {
                var _this = this
                $.ajax({
                    url: 'http://127.0.0.1:5000/api/article/praise',
                    dataType: 'json',
                    type: 'POST',
                    data: {
                        fidno: _this.data.id
                    },
                    async: true,
                    crossDomain: true,
                    success: function (res) {
                        _this.data.praise++
                        _this.praise = false
                    }
                })
            } else {

            }
        }
    },
    props: {
        data: ''
    }
}
</script>
<style>
.operation ul {
    padding-left: 0;
}
</style>